require.config({
  baseUrl: "../javascripts/library/",
  paths: {
    jquery: "jquery",
    axios: "axios",
    cookies: "cookies",
  },
});

//获取对应商品的详情信息
require(["jquery", "axios"], function ($, axios) {
  let id = location.search.split("=")[1];
  axios
    .get("/product/getItem", {
      params: {
        id,
      },
    })
    .then((res) => {
      let data = res.data[0];
      // console.log(data);
      let picture = JSON.parse(data.picture);
      // console.log(picture);
      let infotemp = `
        <div class="info">
          <div class="product-info">
            <div class="info-title">${data.title}</div>
            <div class="sInfo-subtitle">${data.subtitle}</div>
            <div class="sInfo-wrap">
              <div class="divider"></div>
              <div class="sInfo-wrap-content">
                <div class="row-box">
                  <div class="row-box-label item-label">价格</div>
                  <div class="pirce">
                    <span class="nowpirce">¥${data.nowprice}.00</span>
                    <span class="oldpirce">¥${data.oldprice}</span>
                  </div>
                </div>
                <div class="row-box">
                  <div class="row-box-label item-label">领券</div>
                  <div class="row-box-content">
                    <span class="js-coupon-show-more">满99.00减5.00元</span>
                  </div>
                </div>
                <div class="row-box">
                  <div class="row-box-label item-label">促销</div>
                  <div class="row-box-content">
                    <span class="tag">直降</span>
                    <span class="row-box-content">立减 30.00 元</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="info-notice">
            <div class="info-notice-connent">
              物流公告：受疫情影响，北京、上海、黑龙江、吉林、辽宁、河北、江西、江苏、四川、甘肃、青海、新疆、宁夏回族自治区等部分地区暂缓发货。
            </div>
          </div>
          <div class="sInfo-wrap">
            <div class="sInfo-wrap-content">
              <div class="row-box sInfo-cate">
                <div class="cate">
                  <span class="cate-label">分类</span>
                  <ul class="cate-list">
                    <li class="cate-item cur">
                      <a href="">AR1C</a>
                    </li>
                    <li class="cate-item">
                      <a href=""> AR2CCM02 </a>
                    </li>
                    <li class="cate-item">
                      <a href=""> R4PRO-1L43 </a>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="product-status">
                <div class="row-box sInfo-num">
                  <div class="row-box-label item-label">数量</div>
                  <div class="sInfo-num-content">
                    <div class="gcIpt">
                      <a href="" class="disabled">-</a>
                      <input type="text" value="1" class="goodsCount" />
                      <a href="">+</a>
                    </div>
                  </div>
                </div>
                <div class="row-box sInfo-num">
                  <div class="row-box-label item-label">积分</div>
                  <div class="sInfo-num-content">
                    <div class="gcIpt">
                      <span
                        >购买可获得399积分 <i class="iconfont icon-zhuyi"></i
                      ></span>
                    </div>
                  </div>
                </div>
                <div class="sInfo-btns">
                  <span>
                    <a href="" class="btn btn-submit btn-buy">立即购买</a>
                    <a href="" class="btn btn-submit btn-liner">加入购物车</a>
                  </span>
                  <div class="btn btn-like">
                    <i class="iconfont icon-aixin"></i>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
        `;
      let imgtemp = `
        <div class="box" id="box">
        <div id="smallBox" class="small">
          <img src="../${picture[0].src}" alt="" />
          <div id="mask" class="mask"></div>
        </div>
        <div id="bigBox" class="big">
          <img
            src="../${picture[0].src}"
            id="bigImg"
            width="800"
            alt=""
          />
        </div>
      </div>
        `;
      let pictemp = "";
      let i = 0;
      picture.forEach((el) => {
        if (i == 0) {
          pictemp = `
        <div class="swiper-slide active" role="group" aria-label="${i++} / ${
            picture.length
          }" style="width: 90px;">
          <div class="img">
            <img src="../${el.src}" alt="${el.alt}" />
          </div>
        </div>
        `;
        } else {
          pictemp += `
        <div class="swiper-slide" role="group" aria-label="${i++} / ${
            picture.length
          }" style="width: 90px;">
          <div class="img">
            <img src="../${el.src}" alt="${el.alt}" />
          </div>
        </div>
        `;
        }
      });

      $(".picbox-thumb .swiper-wrapper").children().remove();
      $(".picbox-thumb .swiper-wrapper").append(pictemp);

      $(infotemp).replaceAll(".info");
      $(imgtemp).replaceAll(".box");
    })
    .catch((err) => {
      console.error(err);
    });
});

//添加购物车 用cookies跨页面
require(["jquery", "cookies"], function ($, cookies) {
  $(".prod-intro").on("click", function (ev) {
    // btn-liner
    let btns = $(".btn-submit.btn-liner");

    for (let btn of btns) {
      ev.preventDefault();
      if (ev.target == btn) {
        let id = location.search.split("=")[1];
        let num = $(".goodsCount").val();
        let shop = [];
        let temp = `{"id":${id},"num":${num}}-`;
        let cookie = cookies.get("shop");
        let shops = [];
        let t;
        if (!cookie) {
          shop.push(temp);
          cookies.set("shop", shop);
        } else {
          let arr = cookie.split("-"); //单个商品数据
          arr.pop();
          console.log(arr);
          let status = arr.some((el) => {
            //判断当前商品的id在cookies中是否存在
            t = JSON.parse(el);
            return t.id == id;
          });

          //id存在时修改数据
          if (status) {
            arr.forEach((el) => {
              el = JSON.parse(el);
              if (el.id == id) {
                el.num = parseInt(num);
              }
              el = JSON.stringify(el);
              shops.push(el);

              temp = shops.join("-").concat("-");
            });
            // console.log(shops);
          } else {
            arr.push(`{"id":${id},"num":${num}}`);
            temp = arr.join("-").concat("-");
          }

          // console.log(temp);
          cookies.set("shop", temp);
        }
      }
    }
  });
});
